<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
    <title>员工页面</title>
    <link rel="stylesheet" href="../layui/css/layui.css?t=2" media="all">
    <link rel="stylesheet" href="../css/staffMain.css?t=2" media="all">
</head>
<style type="text/css" id="LAY_layadmin_theme"></style>

<body>
<input type="hidden" id="username" th:value="${username}">
<input type="hidden" id="uid" th:value="${uid}">
<div id="LAY_WRAP">
    <div id='LAY_app' class="layui-side layui-bg-black">
        <div class="layui-side-scroll">
            <div class="layui-logo" lay-href=""> <span><b id="welcomeText" th:text="'你好，'+${name}"></b></span> </div>
            <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
            <ul class="layui-nav layui-nav-left layui-nav-tree" lay-filter="layui-nav-left">
                <li class="layui-nav-item">
                    <a class="" href="javascript:;"><i class="layui-icon layui-icon-user"></i> <cite >信息查看</cite></a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;" id="personalInfoManagement" ><i class="fa fa-clipboard fa-lg" ></i> <cite >个人信息</cite></a></dd>
                        <dd><a href="javascript:;" id="showRPInfo"><i class="fa fa-clipboard fa-lg" ></i> <cite >奖惩信息</cite></a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:;"><i class="layui-icon layui-icon-auz"></i><cite >事假管理</cite></a>
                    <dl class="layui-nav-child">
                        <dd><a href="javascript:;"  id="CreateCL"> <cite >发起审批</cite></a></dd>
                        <dd><a href="javascript:;"  id="CLList"> <cite >历史审批</cite></a></dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>

    <!--主体-->
    <div class="layui-body" id="LAY_app_body">
        <div class="layui-header">
            <!-- 头部区域 -->
            <ul class="layui-nav layui-layout-left" lay-filter="layadmin-layout-left">
                <li class="layui-nav-item layadmin-flexible" lay-unselect="">
                    <a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
                        <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect="">
                    <a href="javascript:;" id="mainRefresh" layadmin-event="refresh" title="刷新">
                        <i class="layui-icon layui-icon-refresh-3"></i>
                    </a>
                </li>
                <!--
                            <li class="layui-nav-item layui-hide-xs" lay-unselect="">
                              <input type="text" placeholder="搜索..." autocomplete="off" class="layui-input layui-input-search" layadmin-event="serach" lay-action="template/search/keywords=">
                            </li>
                -->
            </ul>
            <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">
                <li class="layui-nav-item layui-hide-xs" lay-unselect="">
                    <a href="javascript:;" layadmin-event="theme">
                        <i class="layui-icon layui-icon-theme"></i>
                    </a>
                </li>
                <li class="layui-nav-item" lay-unselect="">
                    <a href="javascript:;"> <span th:text="${username}"></span> <span class="layui-nav-more"></span></a>
                    <dl class="layui-nav-child">
                        <!--                  <dd><a lay-href="set/user/info">基本资料</a></dd>-->
                         <dd><a lay-href="set/user/password" id="updatePwd">修改密码</a></dd>
                         <hr>
                        <dd layadmin-event="logout" style="text-align: center;" ><a  id="logout">安全退出</a></dd>
                    </dl>
                </li>
            </ul>
        </div>
        <div class="layui-fluid" style="width: 100% " >
            <div class="layui-row layui-col-space15 box" id="Welcome" >
                <div class="layui-col-md12">
                    <img id="welcomeImg">
                </div>
            </div>
            <div class="layui-row layui-col-space15 box" id="boxPersonalInfo" hidden="true"  style="width: 100% ">
                <div class="layui-col-md12">
                <table id="personalInfo" class="gradientTable" >
                    <tr><td><b>员工ID：</b></td><td><p> </p></td></tr>
                    <tr><td><b>姓名：</b></td><td><p> </p></td></tr>
                    <tr><td><b>性别：</b></td><td><p> </p></td></tr>
                    <tr><td><b>电话：</b></td><td><p> </p></td></tr>
                    <tr><td><b>住址：</b></td><td><p> </p></td></tr>
                    <tr><td><b>生日：</b></td><td><p> </p></td></tr>
                    <tr><td><b>加入时间：</b></td><td><p> </p></td></tr>
                    <tr><td><b>部门：</b></td><td><p> </p></td></tr>
                    <tr><td><b>职位：</b></td><td><p> </p></td></tr>
                    <tr><td><b>薪资：</b></td><td><p> </p></td></tr>
                    <tr><td><b>是否为正<br>
                                式员工：</b></td><td><p> </p></td></tr>
                </table>
                </div>
            </div>
            <div class="layui-row layui-col-space15 box" id="boxCreateCL" hidden="true"  style="width: 100% ">
                <div class="layui-col-md12">
                    <div class="InfoUpdate" >
                        <table>
                            <tr>
                                <td>开始时间：</td>
                                <td> <input id="startTime" style="width: 100%" type="datetime-local" /></td>
                            </tr>
                            <tr>
                                <td>结束时间：</td>
                                <td><input id="endTime" style="width: 100%" type="datetime-local"   /></td>
                            </tr>
                            <td>类型	：</td>
                            <td><select style="width: 100%" id="CLtype">
                                <option value ="事假">事假</option>
                                <option value ="病假">病假</option>
                            </select></td>
                            <tr>
                                <td>细节：</td>
                                <td><input id="CLDetail"  type="text"  style="width: 100%" placeholder="细节" /></td>
                            </tr>
                            <tr>
                                <td colspan="2"><a id="CreateCLConfirm" class="btn pill fill" align="center">发起审批</a>	</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
            <div class="layui-row layui-col-space15 box" id="boxRPlInfo" hidden="true"  style="width: 100% ">
                <div class="layui-col-md12">
                    <div  class="table_wrap" style="width:100%; height:400px;overflow-y: auto;margin: 100px auto;text-align:center">
                        <table  class="table" style="width:70%;margin-top: 20px" cellspacing="0" cellpadding="0" >
                            <thead class="table_head" >
                            <tr>
                                <th>信息ID</th><!--uid-->
                                <th>类型</th>
                                <th>细节</th>
                                <th>奖惩时间</th>
<!--                                <th>操作</th>-->
                            </tr>
                            </thead>

                            <tbody id="RPInfoTableInput">
                            <tr >
                                <td >加载失败</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
<!--                                <td><a name="personalInfoUpdate" class="btn pill fill">修改</a> &lt;!&ndash;<a name="personalInfoDelete" class="btn pill fill">删除</a>&ndash;&gt;</td>-->
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="layui-row layui-col-space15 box" id="boxCLLsit" hidden="true"  style="width: 100% ">
                <div class="layui-col-md12">
                    <div id="tableBoxPersonalInfo" class="table_wrap" style="width:100%; height:400px;overflow-y: auto;margin: 100px auto;text-align:center">
                        <table id="personalInfoTable" class="table" style="width:80%;margin-top: 20px" cellspacing="0" cellpadding="0" >
                            <thead class="table_head" >
                            <tr>
                                <th>审批ID</th><!--uid-->
                                <th>类型</th>
                                <th>开始时间</th>
                                <th>结束时间</th>
                                <th>细节</th>
                                <th>发起时间</th>
                                <th>通过时间</th>
                                <th>状态</th>
                                <th>操作</th>
                            </tr>
                            </thead>

                            <tbody id="CLLsitTableInput">
                            <tr >
                                <td >加载失败</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td>1</td>
                                <td><a name="CLLsitDelete" class="btn pill fill">撤销or删除</a> </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="layui-row layui-col-space15 box" hidden="true"><!--模块div-->
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div style="font-size:20px;color:red" class="layui-card-header">layui学习交流群请加入（701180681）</div>
                        <div class="layui-card-body">

                            <br>小圆点：

                            <span class="layui-badge-dot"></span>
                            <span class="layui-badge-dot layui-bg-orange"></span>
                            <span class="layui-badge-dot layui-bg-green"></span>
                            <span class="layui-badge-dot layui-bg-cyan"></span>
                            <span class="layui-badge-dot layui-bg-blue"></span>
                            <span class="layui-badge-dot layui-bg-black"></span>
                            <span class="layui-badge-dot layui-bg-gray"></span>

                            <br><br>常规弧形徽章：

                            <span class="layui-badge">6</span>
                            <span class="layui-badge">99</span>
                            <span class="layui-badge">61728</span>
                            <span class="layui-badge">赤</span>
                            <span class="layui-badge layui-bg-orange">橙</span>
                            <span class="layui-badge layui-bg-green">绿</span>
                            <span class="layui-badge layui-bg-cyan">青</span>
                            <span class="layui-badge layui-bg-blue">蓝</span>
                            <span class="layui-badge layui-bg-black">黑</span>
                            <span class="layui-badge layui-bg-gray">灰</span>

                            <br><br>边框徽章：

                            <span class="layui-badge-rim">6</span>
                            <span class="layui-badge-rim">Hot</span>

                            <br><br>

                        </div>
                    </div>
                </div>
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">与其它元素的搭配</div>
                        <div class="layui-card-body">

                            <br>

                            <button class="layui-btn">查看消息<span class="layui-badge layui-bg-gray">1</span></button>
                            <button class="layui-btn">动态<span class="layui-badge-dot layui-bg-orange"></span></button>

                            <br><br>

                            <ul class="layui-nav" style="text-align:right;">
                                <li class="layui-nav-item">
                                    <a href="">控制台<span class="layui-badge">9</span></a>
                                </li>
                                <li class="layui-nav-item">
                                    <a href="">个人中心<span class="layui-badge-dot"></span></a>
                                </li>
                                <span class="layui-nav-bar" style="width: 0px; left: 0px; opacity: 0;"></span></ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--用于选色效果-->
<div id='setbgcolor' style="display:none">
    <div class="layui-layer-shade" id="setbgcolorshade" style="z-index: 19891016; background-color: rgb(0, 0, 0); opacity: 0.3;"></div>
    <div class="layui-layer-color">
        <div class='layui-layer-content'>
            <div class="layui-card-header"> 配色方案 </div>
            <div class="layui-card-body layadmin-setTheme">
                <ul class="layadmin-setTheme-color" id='ChangeColor'>
                    <li layadmin-event="setTheme" data-index="0" data-alias="dark" title="dark">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #20222A;">
                            <div class="layadmin-setTheme-logo">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="1" data-alias="dark-blue" title="dark-blue">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #03152A;">
                            <div class="layadmin-setTheme-logo">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="2" data-alias="coffee" title="coffee">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #2E241B;">
                            <div class="layadmin-setTheme-logo">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="3" data-alias="purple-red" title="purple-red">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #50314F;">
                            <div class="layadmin-setTheme-logo">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" id="theme" data-index="4" data-alias="ocean" title="ocean">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #344058;">
                            <div class="layadmin-setTheme-logo" style="background-color: #1E9FFF;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="5" data-alias="green" title="green">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #3A3D49;">
                            <div class="layadmin-setTheme-logo" style="background-color: #2F9688;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="6" data-alias="red" title="red">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #20222A;">
                            <div class="layadmin-setTheme-logo" style="background-color: #F78400;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="7" data-alias="fashion-red"
                        title="fashion-red">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #28333E;">
                            <div class="layadmin-setTheme-logo" style="background-color: #AA3130;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="8" data-alias="classic-black"
                        title="classic-black">
                        <div class="layadmin-setTheme-header">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #24262F;">
                            <div class="layadmin-setTheme-logo" style="background-color: #3A3D49;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="9" data-alias="green-header"
                        title="green-header">
                        <div class="layadmin-setTheme-header" style="background-color: #2F9688;">
                        </div>
                        <div class="layadmin-setTheme-side">
                            <div class="layadmin-setTheme-logo" style="background-color: #226A62;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="10" data-alias="ocean-header"
                        title="ocean-header">
                        <div class="layadmin-setTheme-header" style="background-color: #1E9FFF;">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #344058;">
                            <div class="layadmin-setTheme-logo" style="background-color: #0085E8;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="11" data-alias="classic-black-header"
                        title="classic-black-header">
                        <div class="layadmin-setTheme-header" style="background-color: #393D49;">
                        </div>
                        <div class="layadmin-setTheme-side">
                            <div class="layadmin-setTheme-logo">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="12" data-alias="purple-red-header"
                        title="purple-red-header">
                        <div class="layadmin-setTheme-header" style="background-color: #50314F;">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #50314F;">
                            <div class="layadmin-setTheme-logo" style="background-color: #50314F;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="13" data-alias="fashion-red-header"
                        title="fashion-red-header">
                        <div class="layadmin-setTheme-header" style="background-color: #AA3130;">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #28333E;">
                            <div class="layadmin-setTheme-logo" style="background-color: #28333E;">
                            </div>
                        </div>
                    </li>
                    <li layadmin-event="setTheme" data-index="14" data-alias="green-header"
                        title="green-header">
                        <div class="layadmin-setTheme-header" style="background-color: #009688;">
                        </div>
                        <div class="layadmin-setTheme-side" style="background-color: #28333E;">
                            <div class="layadmin-setTheme-logo" style="background-color: #009688;">
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
</div>
<!--辅助作用一般用于手机遮罩层-->
<div class="layui-layer-shade mobilenav" id="mobilenav" onClick="clearmobilenav()" style="z-index: 998; background-color: rgb(0, 0, 0); opacity: 0.3;display:none"></div>
</body>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../layui/layui.js?t=2"></script>
<script type="text/javascript" src="../js/common.js?t=2"></script>
<script type="text/javascript" src="../js/StaffMain.js"></script>
</html>